package com.zd.composedemo.ui.compose

import android.util.Log
import androidx.appcompat.widget.Toolbar
import androidx.compose.animation.animateColorAsState
import androidx.compose.animation.animateContentSize
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.BoxWithConstraints
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.LazyListState
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.Button
import androidx.compose.material3.HorizontalDivider
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.material3.TopAppBar
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.layoutId
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.core.graphics.createBitmap
import androidx.core.graphics.toColorInt
import com.zd.composedemo.R
import com.zd.composedemo.ui.theme.ComposeDemoTheme
import kotlinx.coroutines.launch
import kotlin.random.Random

data class MessageBean(
    val id: Int = 0,
    val title: String? = null,
    val info: String? = null
)

@Composable
fun ItemLayout(msg: MessageBean, modifier: Modifier = Modifier) {
    Log.e(">>>>>", "ItemLayout: ----------------------->init")
    Row(
        modifier = modifier
            .fillMaxWidth()
            .padding(10.dp, 5.dp)
    )
    {
        Image(
            painter = painterResource(R.drawable.baseline_robot_24),
            contentDescription = null,
            modifier = Modifier
//                .padding(5.dp, 0.dp, 0.dp, 0.dp)
                .size(40.dp)
                .background(Color("#20000000".toColorInt()), CircleShape)
                .clip(CircleShape)
                .border(1.dp, Color.Red, CircleShape)
        )

        Spacer(modifier = Modifier.width(10.dp))

        Column {
            Text(
                text = msg.title ?: "",
                color = MaterialTheme.colorScheme.primary,
                style = MaterialTheme.typography.titleSmall,
                modifier = Modifier
            )

            Spacer(modifier = Modifier.height(5.dp))

            var isOpen by remember { mutableStateOf(false) }

            val surfaceColor by animateColorAsState(
                if (isOpen) MaterialTheme.colorScheme.scrim
                else MaterialTheme.colorScheme.onSecondary
            )

            Surface(
                shape = MaterialTheme.shapes.small,
                color = surfaceColor,
                shadowElevation = 1.dp,
                modifier = Modifier
                    .clickable { isOpen = !isOpen }
                    .animateContentSize()
//                    .padding(1.dp)
            ) {
                Text(
                    text = msg.info ?: "", color = MaterialTheme.colorScheme.secondary,
                    style = MaterialTheme.typography.bodySmall,
                    maxLines = if (isOpen) Int.MAX_VALUE else 2,
                    overflow = TextOverflow.Ellipsis,
                    modifier = Modifier.padding(10.dp, 4.dp),
                )
            }
        }
    }
}

//@Preview(name = "Light Mode")
@Preview(
    showBackground = true,
    name = "Dark Mode",
//    uiMode = Configuration.
)
@Composable
private fun prevItemLayout() {
    ComposeDemoTheme {
        ItemLayout(
            MessageBean(
                0,
                "Android",
                "jetpack compose demo jetpack compose demo jetpack compose demo jetpack compose demo jetpack compose demo "
            )
        )
    }
}

@Composable
fun ListItemsLayout(
    datas: MutableList<MessageBean>?,
    state: LazyListState = rememberLazyListState()
) {
    datas?.let {
        Log.e(">>>>>", "ListItemsLayout: -----------------------?init")
        LazyColumn(state = state) {
            //key里面的值不变化就不会重组组件
            items(it.toList(), key = { it.id }) { itemBean ->
                ItemLayout(itemBean)
                HorizontalDivider()
            }
        }
    }
}

@Preview(showBackground = true)
//@PreviewLightDark
@Composable
fun prevListItemsLayout() {
    val itemDataList = mutableListOf<MessageBean>().apply {
        repeat(4) {
            add(MessageBean(it, "Android", "就是一个item信息${Random.nextBoolean()}"))
        }
    }
    ListItemsLayout(itemDataList)
}

@Composable
fun ClickButton(clickId: Int, clickCallback: () -> Unit) {
    Log.e(">>>>>", "ClickButton: -->--------------------")
    Button(onClick = clickCallback) {
        Text("clickButton ${clickId}")
    }
}

@Preview(showBackground = true)
@Composable
fun HelloContent() {
    val (value, setValue) = rememberSaveable { mutableStateOf("") }
//    val (value, setValue) = remember { mutableStateOf("") }
    Column(modifier = Modifier.padding(16.dp)) {
        Text(
            text = "Hello!",
            modifier = Modifier
                .padding(bottom = 8.dp)
                .layoutId("textInfo"),
            style = MaterialTheme.typography.bodyMedium
        )
        OutlinedTextField(
            value = value,
            onValueChange = {
                setValue(it)
            },
            label = { Text("Name") }
        )
    }
}

@Composable
fun MessageListLayout(
    messageBean: MutableList<MessageBean>,
    state: LazyListState = rememberLazyListState(),
    modifier: Modifier = Modifier
) {

    Column(modifier = modifier) {
        LazyColumn(
            state = state, modifier = Modifier
                .fillMaxWidth()
                .weight(1f)
        ) {
            items(messageBean.toList(), key = { it.id }) { item ->
                ItemLayout(item)
                HorizontalDivider()
            }
        }

        val space = rememberCoroutineScope()
        Button(onClick = {
            space.launch {
                state.scrollToItem(0, 0)
            }
        }) {
            Text("toTop")
        }
    }

}

@Preview(showBackground = true)
@Composable
fun ToT() {

}

fun Modifier.showBg(color: Color) = padding(10.dp).background(color, RoundedCornerShape(10.dp))